<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="UTF-8">
		<title>RedStoe | Ecommerce Website</title>
		<link rel="stylesheet" href="style.css">
		<link rel="preconnect" href="https://fonts.googleapis.com">
		<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
		<link href="https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap" rel="stylesheet">
		<link href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">
	</head>
	<body>
	<div class="header">
		<div class="container">
			<div class="navbar">
				<div class="logo">
					<img src="images/logo.png" width="125px">
				</div>
				<nav>
					<ul>
						<li><a href="">Home</a></li>
						<li><a href="">Products</a></li>
						<li><a href="">About</a></li>
						<li><a href="">Contact</a></li>
						<li><a href="">Account</a></li>
					</ul>
				</nav>
				<img src="images/cart.png" width="30px" height="30px">
			</div>
			<div class="row">
				<div class="col-2">
					<h1>Give Your Workout<br>A New Style</h1>
					<p>Success isn't always about greatness. It's about
						consistency. Consistent<br> hard work gains success. Greatness will come.</p>
					<a href="" class="btn">Explore Now &#8594;</a>
				</div>
				<div class="col-2">
					<img src="images/image1.png">
				</div>
			</div>
		</div>
	</div>
	<!-- featured categories -->
	<div class="categories">
		<div class="small-container">
			<div class="row">
				<div class="col-3">
					<img src="images/category-1.jpg">
				</div>
				<div class="col-3">
					<img src="images/category-2.jpg">
				</div>
				<div class="col-3">
					<img src="images/category-3.jpg">
				</div>
			</div>
		</div>
	</div>
	<!-- featured products -->
	<div class="small-container">
		<h2 class="title">Featured Products</h2>
		<div class="row">
			<div class="col-4">
				<img src="images/product-1.jpg">
				<h4>Red Printed T-Shirt</h4>
				<div class="rating">
					<i class="fa fa-star"></i>
					<i class="fa fa-star"></i>
					<i class="fa fa-star"></i>
					<i class="fa fa-star"></i>
					<i class="fa fa-star-o"></i>
				</div>
				<p>$50.00</p>
			</div>
			<div class="col-4">
				<img src="images/product-2.jpg">
				<h4>Red Printed T-Shirt</h4>
				<div class="rating">
					<i class="fa fa-star"></i>
					<i class="fa fa-star"></i>
					<i class="fa fa-star"></i>
					<i class="fa fa-star-half-o"></i>
					<i class="fa fa-star-o"></i>
				</div>
				<p>$50.00</p>
			</div>
			<div class="col-4">
				<img src="images/product-3.jpg">
				<h4>Red Printed T-Shirt</h4>
				<div class="rating">
					<i class="fa fa-star"></i>
					<i class="fa fa-star"></i>
					<i class="fa fa-star"></i>
					<i class="fa fa-star"></i>
					<i class="fa fa-star-half-o"></i>
				</div>
				<p>$50.00</p>
			</div>
			<div class="col-4">
				<img src="images/product-4.jpg">
				<h4>Red Printed T-Shirt</h4>
				<div class="rating">
					<i class="fa fa-star"></i>
					<i class="fa fa-star"></i>
					<i class="fa fa-star"></i>
					<i class="fa fa-star"></i>
					<i class="fa fa-star-o"></i>
				</div>
				<p>$50.00</p>
			</div>
		</div>
	</div>

	</body>
</html>